/**
 * Created by Dalyn on 2017/3/7.
 */
import React from "react";
import { hashHistory } from 'react-router';
import Confirm from "../common/Confirm.js";
import InputBox from "../common/InputBox.js";
import Test from "../common/Test.js";
import ResetUserPwdTwoStepMutation from "./mutation/ResetUserPwdTwoStepMutation";
import Relay from "react-relay";
import UpdatePasswordMutation from "./mutation/UpdatePasswordMutation"

export default class Find_pw1 extends React.Component{
    constructor(props) {
        super(props);
        this.style={
            username: {
                width: "254px",
                height: "40px",
                borderColor: "#bbbbbb",
                marginTop: "15px"
            },
            confirm:{
                width: '256px',
                height: '42px',
                backgroundColor:"#1b3249",
                fontSize:"18px",
                color:"#fff",
                marginTop:"16px",
                fontFamily: "Microsoft YaHei"
            }
        }
        this.state={
            info:''
        }
        this.phone = ''
    }

    componentWillMount(){
        let userinfo
        if(this.props.params.token){
            userinfo = this.props.params.token.split('*');
            this.token = userinfo[0];
            this.phone = userinfo[1];
        }
        Relay.Store.commitUpdate(
            new ResetUserPwdTwoStepMutation({
                phone : this.phone,
                token : this.token
            }),
            {
                onFailure:()=>{

                },
                onSuccess:(response)=>{
                    let errorCode = response.resetUserPwdOneStep.data.errorCode
                    if(errorCode!='0'){
                        hashHistory.push('/')
                    }
                }
            });
    }


    next(){
        let old = this.refs.oldpassword.state.text;
        let npassword = this.refs.newpassword.state.text;
        if(old != npassword){
            this.setState({
                info:'*两次密码不一致'
            });
            return;
        }
        if(old.length==0){
            this.setState({
                info:'*请输入密码'
            });
            return;
        }
        if(old.length<6||old.length>=33){
            this.setState({
                info:'*密码格式不正确'
            });
            return;
        }

        Relay.Store.commitUpdate(
            new UpdatePasswordMutation({
                phone:this.phone,
                password:npassword

            }),
            {
                onFailure:()=>{

                },
                onSuccess:(response)=>{
                    let errorCode = response.updatePassword.updatePassword.errorCode;
                    let value = response.updatePassword.updatePassword.value
                    if(errorCode == '0'){
                        this.setState({
                            info:''
                        });
                        hashHistory.push('/welocme/password')
                    }else{
                        this.setState({
                            info: value
                        });
                    }
                }
            }
        );
    }
    render(){
        return (
            <div style={Style.box}>
                <p style={Style.p}>重置密码</p>
                <InputBox style={this.style.username} type="password" defaultvalute="请输入密码，6-12位数字或字母" ref={"oldpassword"} isloginintext={true}/>
                <InputBox style={this.style.username} type="password" defaultvalute="请再次输入密码" ref={"newpassword"} isloginintext={true}/>
                <p style={Style.point}>{this.state.info}</p>
                <Confirm style={this.style.confirm} tcontext={'下一步'}
                         touch={this.next.bind(this)}/>
            </div>
        )
    }
}
var Style = {
    box:{
        width:"259px",
        height:"329px",
        margin:"0 auto",
        padding:"10px 0"
    },
    p:{
        height:"18px",
        fontSize:"20px",
        textAlign:"center",
        lineHeight:"18px",
        verticalAlign:"middle",
        padding:"28px 0",
        margin:"0 auto",
        color:"#1b3249",
        fontFamily: "Microsoft YaHei"
    },
    point:{
        width: "256px",
        height: "13px",
        color:"red",
        textAlign: "left",
        lineHeight: "13px",
        padding: "11px 0",
        margin: "0 auto",
    }
}
